<!-- Dom模板 -->
<template>
  <div>
    <img :src="imgurl" alt="" />
    <!-- <input type="text" v-model="title" /> -->
    <input type="file" value="上传文件" ref="file" @change="shangc" />
    <!-- <button @click="tijiao">上传</button> -->
    <!-- Dom内容 -->

    <!-- <mavon-editor
      ref="md"
      @change="getValue"
      :boxShadow="true"
      v-model="md_value"
      @imgAdd="$imgAdd"
    /> -->
    <!-- <button @click="save">提交</button> -->
    <!-- <router-view></router-view> -->
  </div>
</template>
<script>
// import a from './a'; // 引入组件
import { uploadToGithub } from "../api/upload";
import getFileBase64 from "../utils/toBase64";
export default {
  name: "",
  data() {
    return {
      img_url_pre: "https://cdn.jsdelivr.net/gh/zmf-6/cdn/",
      imgurl: "",
    };
  },

  // 监听属性
  computed: {},
  // 组件挂载的地方
  components: {},
  // 生命周期 - 创建完成（访问当前this实例）
  created() {},
  // 生命周期 - 挂载完成（访问DOM元素）
  mounted() {},
  // Vue方法定义
  methods: {
    async shangc() {
      let base64Img = await getFileBase64(this.$refs.file.files[0]);
      console.log(base64Img);
      // 文件的名字
      let res = await uploadToGithub(this.$refs.file.files[0].name, base64Img);
      console.log(res.data.content.path);
      this.imgurl = this.img_url_pre + res.data.content.path;
      console.log(this.imgurl);
    }
  },
};
</script>

<style scoped>
/* @import url(''); 引入css类 */
</style>